// 引入常态化样式
require("../../assets/css/normalize.css");
//引入重置样式
require("../../assets/css/reset.css");
// 引入公共样式
require("../../assets/css/common.css");
// 引入阿里矢量图
require("../../assets/fonts/iconfont.css");
// 引入自己的样式
require("./sport_run_ing.less");

//引入公共js
const dom = require("../../utils/dom.js");
const axios = require("../../utils/axios.js");
const timetype = require("../../utils/timetype.js");

document.addEventListener("DOMContentLoaded", function () {
	//1. 点击暂停让继续和结束按钮出现
	dom.get(".pausebtn").addEventListener("click", function () {
		dom.get(".continuebtn").style.display = "block";
		dom.get(".finishbtn").style.display = "block";
		this.style.display = "none";
		clearInterval(timer); //清除定时器
	});
	//2. 点击继续让暂停按钮出现
	dom.get(".continuebtn").addEventListener("click", function () {
		dom.get(".finishbtn").style.display = "none";
		dom.get(".pausebtn").style.display = "block";
		this.style.display = "none";
		start(); //点击继续开启定时器
	});
	//3. 渲染数据
	let duration = 0; //持续时间
	let calorie = 0; //卡路里
	let meter = 0; //运动距离
	// 3.1 设置周期定时器
	let timer = null;
	function start() {
		timer = setInterval(function () {
			// 速度
			let speed = getrandom(7, 3);
			dom.get(".speed").textContent = `${speed}米/秒`;
			//持续时间
			duration++;
			dom.get(".duration").textContent = timetype.gettime(duration);
			//运动距离
			meter += speed;
			dom.get("#kmnum").textContent = (meter / 1000).toFixed(3);

			// 卡路里
			calorie = 60 * (meter / 1000) * 1.035;
			dom.get(".calorie").textContent = calorie.toFixed(2);
		}, 1000);
	}
	start();
	//获取随机数
	function getrandom(max, min) {
		return Math.floor(Math.random() * (max - min + 1) + min);
	}
	// 4.点击结束发送请求保存数据
	dom.get(".finishbtn").addEventListener("click", function () {
		axios
			.post("/api/exercise/save", {
				type: 1,
				duration,
				calorie,
				meter,
			})
			.then((res) => {
				if (res.data.errno === 0) {
					alert("跑的真快，下次再跑");
					location.href = "sport_run.html";
				}
			});
	});
});
